<template>
  <div class="title">
    <el-row class="co2" style="height: 100%;">
      <el-col :xl="4" :lg="4" :md="4" :sm="4" :xs="4">

        <div class="titleLeft">
          <p>
          <p><el-avatar :size="50" src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" /></p>cv大师
          </p>
          <p>
          <div
            style="height: 30px;width: 80px;background-color:rgba(255, 84, 115, 0.1);display: flex;align-items: center;justify-content: center;color: #ff5473;border-radius: 6px;cursor: pointer;">
            <Icons type="icon-xihuan" style="font-size: 20px;"></Icons>已关注
          </div>
          <div
            style="margin-top:5px;height: 30px;width: 80px;background-color:rgba(41, 151, 247, 0.1);;display: flex;align-items: center;justify-content: center;color: #2997f7;border-radius: 6px;cursor: pointer;">
            <Icons type="icon-xiaoxi-zhihui" style="font-size: 20px;"></Icons>私信
          </div>
          </p>

          <p style="font-size: 0.8rem; color: var(--muted-color);">发布: 2024-10-8 17:30</p>
        </div>
      </el-col>
      <el-col :xl="20" :lg="20" :md="20" :sm="20" :xs="20">
        <div class="titleright">
          <div>测试帖子标题之网站实战</div>
          <div>
            测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战测试帖子标题之网站实战
          </div>
          <div>
            <el-row style="height: 100%;">
              <el-col :xl="6" :lg="6" :md="6" :sm="12" :xs="12">
                <el-image src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" fit="cover" />
              </el-col>
              <el-col :xl="6" :lg="6" :md="6" :sm="12" :xs="12">
                <el-image src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" fit="cover" />
              </el-col>
              <el-col :xl="6" :lg="6" :md="6" :sm="12" :xs="12">
                <el-image src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" fit="cover" />
              </el-col>
              <el-col :xl="6" :lg="6" :md="6" :sm="12" :xs="12">
                <el-image src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" fit="contain" />
              </el-col>
            </el-row>
          </div>
          <div>
            <div>
              <ElTag type="danger" size="large">测试社区113</ElTag>
            </div>
            <div>
              <p> 2000阅读</p>
              <p>
                <Icons type="icon-tuijian3" style="font-size: 20px;"></Icons><text>1</text>
              </p>
           
              <p>
                <Icons type="icon-chuangkouzuidahua" style="font-size: 20px;"></Icons>
              </p>
            </div>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script setup lang='ts'>
import { ref, reactive, defineProps } from 'vue'
import { Icons } from 'ikicons'
import { ElRow, ElCol, ElButton, ElAvatar, ElTag, ElImage } from 'element-plus'
const props = defineProps({
  postXx: {
    type: Object,
    default: () => ({
      avatar: "",
      postcreatetime: "",
      postneedpermissiontype: 1, postsection: '', posttitle: "", username: "",
    }),
  },
})
const rand = () => {

}
</script>

<style scoped>
@import '@/assets/css/sonmepost.css';
</style>